﻿@{
    ViewBag.Title = "首页";
}
@section header{
    <link href="~/Content/css/home.css" rel="stylesheet" />
}
<!--[if lte IE 9]>
    <p class="browsehappy">
        你正在使用<strong>过时</strong>的浏览器，暂不支持。 请 <a href="http://browsehappy.com/" target="_blank">升级浏览器</a>
        以获得更好的体验！
    </p>
<![endif]-->
<div id="app">
    <div class="home-title">
        <nav class="am-g am-g-fixed am-show-sm-only">
            <div>
                <img src="~/Content/imgs/logo.png" style="height: 70px;" />
                @*<button class="am-topbar-btn am-topbar-toggle am-btn am-btn-sm am-btn-success am-show-sm-only" data-am-collapse="{target: '#blog-collapse'}">
                        <span class="am-sr-only">导航切换</span>
                        <span class="am-icon-bars"></span>
                    </button>*@
            </div>
            <div class="am-collapse am-topbar-collapse" id="blog-collapse">
                <ul class="am-nav am-nav-pills am-topbar-nav">
                    <li v-for="link in links.all">
                        <a target="_blank" v-bind:title="link.name" v-bind:href="link.href">
                            <span>{{ link.name }}</span>
                        </a>
                    </li>
                </ul>
            </div>
        </nav>
    </div>
    <div class="am-g am-g-fixed am-hide-sm-only">
        <img src="~/Content/imgs/logo.png" style="position: absolute" />
        <img src="~/Content/imgs/title.png" class="am-center" />
    </div>
    <div class="am-g am-g-fixed am-show-sm-only">
        <img src="~/Content/imgs/title_sm.png" class="am-center" style="width: 340px;" />
    </div>
    <div class="am-g am-g-fixed">
        <div class="am-u-lg-6 am-u-md-12 am-u-sm-12" v-for="group in links.items">
            <div class="tlw-btn-group">
                <div class="am-u-lg-4 am-u-md-4 am-u-sm-6" v-for="link in group.items">
                    <a class="tlw-btn" v-bind:href="link.href != null ? link.href : '#' " v-bind:title="link.name" target="_blank">
                        <div class="am-center">
                            <img v-bind:title="link.name" v-bind:src="'/Content/imgs/' + link.imageName + '.png'" />
                        </div>
                        <p> {{ link.name }}</p>
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>
<footer class="am-g am-g-fixed footer">
    <div class="am-u-md-12 am-u-sm-12">
        <p class="am-text-center">
            <span>电话：0591-87541518（4645、4648、4650）&nbsp;&nbsp;&nbsp;&nbsp; 传真：0591-87500893</span>
        </p>
    </div>
    <div class="am-u-md-12 am-u-sm-12">
        <p class="am-text-center">
            <span>版权所有&copy;福建特力惠信息科技股份有限公司.信息中心</span>
        </p>
    </div>
</footer>
@section scripts
{
    <script>
        var vm = new Vue({
            el: "#app",
            data: {
                links: []
            }
        });
        abp.services.app.homeService.getData({})
            .done(function (data) {
                vm.links = data;
            });
    </script>
}
